<template>
  <a-modal v-model:open="isShow" @cancel="handleCancel" title="库存调拨" style="width: 700px">
    <template #footer>
      <a-button @click="handleCancel">取消</a-button>
      <a-button type="primary" :loading="btnLoading" @click="handleOk">确定</a-button>
    </template>
    <a-spin :spinning="loading">
      <div style="margin-top: 15px">库存池: {{poolCode}} / {{warehouseCode}}</div>
      <div style="margin-top: 15px">SKU: {{productSku}}</div>
      <div style="display: flex;margin-top: 15px;">
        <span style="font-size: 20px;font-weight: bolder">总库存：{{totalStock}}</span>
        <a-tooltip placement="top" title="总库存 - 独立站独占库存 - 三方独占库存 - 红人库存独占">
        <span style="font-size: 20px;font-weight: bolder;margin-left: 200px;">
          公共库存<QuestionCircleOutlined style="font-size: 14px;"/>：<span style="color:#00f">{{publicStock}}</span>
        </span>
        </a-tooltip>
      </div>
      <a-table bordered style="margin-top: 15px" :columns="columns" :data-source="data" :pagination="false">
        <template #headerCell="{ column }">
          <template v-if="column.key === 'sellableQty'">
            <a-tooltip placement="top">
              <template #title>
                <div>独立站可售 = 公共库存 + least(三方独占 - 三方待处理, 0) + least(红人独占 - 红人待处理, 0) + (独立站独占 - 独立站待处理)</div>
                <div>三方可售 = 公共库存 + least(独立站独占 - 独立站待处理, 0) + least(红人独占 - 红人待处理, 0) + (三方独占 - 三方待处理)</div>
                <div>红人可售 = 公共库存 + least(独立站独占 - 独立站待处理, 0) + least(三方独占 - 三方待处理, 0) + (红人独占 - 红人待处理)</div>
              </template>
              <span>
              剩余可用<QuestionCircleOutlined/>
            </span>
            </a-tooltip>
          </template>
        </template>
        <template #bodyCell="{ column, record }">
          <template v-if="column.key === 'leftQty'" >
            <div style="display: flex;align-items: center;justify-content: space-between">
              <a-button type="primary" @click="selectAll(record)" size="small">占有全部</a-button>
             <div>
               <span>{{record.leftQty}} +</span>
               <a-input-number @change="numberChange(record)" size="small" :precision="0" v-model:value="record.addQty" style="width: 100px;margin-left: 5px" />
               <span>= {{record.leftQty + record.addQty}}</span>
             </div>
              <a-button type="primary" @click="deleteAll(record)" size="small">释放全部</a-button>
            </div>
          </template>
          <template v-else-if="column.key === 'sellableQty'">
            <span style="color:#00f">{{record.sellableQty}}</span>
          </template>
        </template>
      </a-table>
    </a-spin>
  </a-modal>
</template>
<script setup>
import { ref, defineProps, defineEmits,computed,watch } from 'vue'
import {getAllot, submitAllot} from "@/api/inventoryPools/skuPool.js";
import {message} from "ant-design-vue";
const props = defineProps({
  isOpen:{
    type: Boolean,
    default: false
  },
  item:{
    type:Object,
    default: ()=>{}
  }
})
const totalStock = ref(2)
const loading = ref(false)
const poolCode = ref('')
const warehouseCode = ref('')
const productSku = ref('')
const data = ref([
  {
    platform:'独立站',
    leftQty:2,
    addQty:0,
    enableQty:2,
    orderQty:0,
    sellableQty:0
  },
  {
    platform:'三方',
    leftQty:0,
    addQty:0,
    enableQty:0,
    orderQty:0,
    sellableQty:0
  },
  {
    platform:'红人',
    leftQty:0,
    addQty:0,
    enableQty:0,
    orderQty:0,
    sellableQty:0
  }
]);
//独立站剩余可售
const initSellableQty1 = () => {
  //独立站剩余可售
  return publicStock.value + Math.min(data.value[1].leftQty + data.value[1].addQty - data.value[1].orderQty,0)
      + Math.min(data.value[2].leftQty + data.value[2].addQty - data.value[2].orderQty,0)
      + data.value[0].leftQty + data.value[0].addQty - data.value[0].orderQty
}
//三方剩余可售
const initSellableQty2 = () => {
  //独立站剩余可售
  return  publicStock.value + Math.min(data.value[0].leftQty + data.value[0].addQty - data.value[0].orderQty,0)
      + Math.min(data.value[2].leftQty + data.value[2].addQty - data.value[2].orderQty,0)
      + data.value[1].leftQty + data.value[1].addQty - data.value[1].orderQty
}
//红人剩余可售
const initSellableQty3 = () => {
  //独立站剩余可售
  return  publicStock.value + Math.min(data.value[0].leftQty + data.value[0].addQty - data.value[0].orderQty,0)
      + Math.min(data.value[1].leftQty + data.value[1].addQty - data.value[1].orderQty,0)
      + data.value[2].leftQty + data.value[2].addQty - data.value[2].orderQty
}
const columns = [
  {
    title: '平台',
    dataIndex: 'platform',
    key: 'age',
    align: 'center',
  },
  {
    title: '独占',
    dataIndex:'leftQty',
    key:'leftQty',
    align: 'center',
    width:350,
  },
  {
    title: '可用',
    dataIndex:'enableQty',
    key:'enableQty',
    align: 'center',
  },
  {
    title: '待处理',
    dataIndex:'orderQty',
    key:'orderQty',
    align: 'center'
  },
  {
    title: '剩余可售',
    dataIndex:'sellableQty',
    key:'sellableQty',
    align: 'center',
  }
];
const publicStock = computed(()=>{
  return totalStock.value - data.value[0].leftQty - data.value[0].addQty - data.value[1].leftQty - data.value[1].addQty
           - data.value[2].leftQty - data.value[2].addQty
})
const numberChange = (record) => {
  //独立站剩余可售
  let sum1 = publicStock.value + Math.min(data.value[1].leftQty + data.value[1].addQty - data.value[1].orderQty,0)
             + Math.min(data.value[2].leftQty + data.value[2].addQty - data.value[2].orderQty,0)
             + data.value[0].leftQty + data.value[0].addQty - data.value[0].orderQty
  //三方剩余可售
  let sum2 = publicStock.value + Math.min(data.value[0].leftQty + data.value[0].addQty - data.value[0].orderQty,0)
             + Math.min(data.value[2].leftQty + data.value[2].addQty - data.value[2].orderQty,0)
             + data.value[1].leftQty + data.value[1].addQty - data.value[1].orderQty
  //红人剩余可售
  let sum3 = publicStock.value + Math.min(data.value[0].leftQty + data.value[0].addQty - data.value[0].orderQty,0)
      + Math.min(data.value[1].leftQty + data.value[1].addQty - data.value[1].orderQty,0)
      + data.value[2].leftQty + data.value[2].addQty - data.value[2].orderQty
  data.value[0].sellableQty = sum1
  data.value[1].sellableQty = sum2
  data.value[2].sellableQty = sum3
}
const selectAll = (record) => {
  record.addQty = record.addQty + publicStock.value
}
const deleteAll = (record) => {
  console.log(record)
  record.addQty = record.addQty - record.leftQty
}
const isShow = computed(()=>{
  return props.isOpen
})
const btnLoading = ref(false)
const emit = defineEmits(['close'])
/**
 * 关闭弹窗
 */
const handleCancel = () => {
  emit('close')
}
/**
 * 确定
 */
const handleOk = async () => {
  try{
    if(data.value[0].leftQty + data.value[0].addQty < 0){
      message.error('独占库存不能为负数')
      return
    }
    if(publicStock.value < 0){
      message.error('公共库存不能为负数')
      return
    }
    if(totalStock.value < publicStock){
      message.error('总库存不能小于公共库存')
      return
    }
    btnLoading.value = true
    const res = await submitAllot({
      poolCode: poolCode.value,
      productSku: productSku.value,
      warehouseCode: warehouseCode.value,
      allotDetailList: data.value,
      qty: totalStock.value,
    })
    console.log(res)
    message.success('平台SKU：'+ res.message + '，调拨成功')
    emit('close')
  }catch (e) {
    message.error(e)
  }finally {
    btnLoading.value = false
  }
}
const init = async () => {
  try{
    loading.value = true
    const res = await getAllot(props.item)
    console.log(res)
    poolCode.value = res.result.poolCode
    productSku.value = res.result.productSku
    warehouseCode.value = res.result.warehouseCode
    totalStock.value = res.result.qty
    publicStock.value = res.result.commonQty
    data.value = res.result.allotDetailList
    data.value.forEach(item => {
      item.addQty = 0
    })
  }catch (e) {
    message.error(e)
  }finally {
    loading.value = false
  }
}
watch(()=>isShow.value,()=>{
  if(isShow.value){
    init()
    data.value[0].sellableQty = initSellableQty1()
    data.value[1].sellableQty = initSellableQty2()
    data.value[2].sellableQty = initSellableQty3()
  }
})

</script>
<style scoped>

</style>
